<template>
	<div class="y" style="background-color:#eeeeee;height: 800px;">
		<div class="x" style="padding: 13px 20px;background-color: #ffde03;align-items: center;">
			<image src="/static/logo.png" style="width: 56px; height: 56px;border-radius: 28px;"></image>
			<span style="margin: 0px 12px;">微信用户</span>
		</div>
		<div style="background-color:#ffde03" class="x">
			<div style="background-color: #202e51;width: 400px;height: 40px;margin-left: 17px;border-radius: 5px;">
				<!-- <image src="../../static/提示.png" class="t2"></image> -->
				<span class="t1">让我们了解你更多</span>
				<span class="t2">绑定手机号></span>
			</div>
		</div>
		<div class="x"
			style="background-color: #ffffff;width: 400px;height: 40px;margin: 6px 15px;border-radius: 5px;">
			<image src="../../static/客服.png" class="t3"></image>
			<span style="margin: 9px;">有疑问找专属顾问帮您解决</span>
		</div>
		<div style="background-color: #ffffff;width: 400px;height: 80px;border-radius: 5px;margin: 3px 15px;">
			<div class="t4">我的订单<span style="margin-left: 290px;">></span></div>
			<div class="x">
				<div class="y">
					<image src="../../static/待支付.png" class="t5"></image>
					<span class="t6">待支付</span>
				</div>
				<div class="y">
					<image src="../../static/快递.png" class="t5"></image>
					<span class="t6">待收货</span>
				</div>
				<div class="y">
					<image src="../../static/业务.png" class="t5"></image>
					<span class="t6">待自提</span>
				</div>
				<div class="y">
					<image src="../../static/退款单.png" class="t5"></image>
					<span class="t6">退换货</span>
				</div>
				<div class="y">
					<image src="../../static/待评价.png" class="t5"></image>
					<span class="t6">待评价</span>
				</div>
			</div>
		</div>
		<div style="background-color: #ffffff;width: 400px;height: 130px;border-radius: 5px;margin: 3px 15px;">
			<div class="x">
				<div class="y">
					<image src="../../static/004_位置.png" class="t7"></image>
					<span class="t8">收货地址</span>
				</div>
				<div class="y">
					<image src="../../static/个人信息.png" class="t7"></image>
					<span class="t8">个人信息</span>
				</div>
				<div class="y">
					<image src="../../static/礼物.png" class="t7"></image>
					<span class="t8">我的礼物</span>
				</div>
				<div class="y">
					<image src="../../static/004_消息.png" class="t7"></image>
					<span class="t8">我的评价</span>
				</div>
			</div>
			<div class="x">
				<div class="y">
					<image src="../../static/收藏.png" class="t7"></image>
					<span class="t8">收货地址</span>
				</div>
				<div class="y">
					<image src="../../static/004_设置.png" class="t7"></image>
					<span class="t8">关于设置</span>
				</div>
			</div>
		</div>
		<div>
			<span style="margin: 2px 170px;font-size: 12px;color: #aaaaff;">欢迎使用❤️</span>
		</div>
		
	</div>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
	}
</script>

<style>
	.x {
		display: flex;
		flex-direction: row;
	}

	.y {
		display: flex;
		flex-direction: column;
	}

	.t1 {
		color: #ffffff;
		padding: 20px 12px;
		font-size: 13px;
	}

	.t2 {
		color: #ffffff;
		margin-top: 30px;
		margin-left: 190px;
		font-size: 13px;

	}

	.t3 {
		width: 30px;
		height: 30px;
		margin-top: 6px;
		margin-left: 10px;
	}

	.t4 {
		margin: 2px 12px;
		font-size: 14px;
	}

	.t5 {
		width: 30px;
		height: 30px;
		border-radius: 5px;
		margin-left: 37px;
		margin-top: 5px;
	}

	.t6 {
		margin-left: 33px;
		font-size: 13px;
	}
	.t7{
		width: 30px;
		height: 30px;
		margin-top: 12px;
		margin-left: 50px;
	}
	.t8{
		margin-left: 40px;
		font-size: 13px;
	}
</style>